import request from "@/services/interceptors";
import { labelListAtom } from "@/store/enum";
import { AddEditProps } from "@/types";
import { EditOutlined, PlusOutlined } from "@ant-design/icons";
import { ModalForm, ProFormSelect } from "@ant-design/pro-components";
import { Button, Form, message } from "antd";
import { useAtom, useAtomValue } from "jotai";

const EditLabels = ({ editData, onSuccess, trigger }: AddEditProps) => {
  const [form] = Form.useForm<{ labelIds: string[] }>();
  const labelList = useAtomValue(labelListAtom); // 使用新的 loader 获取

  const onOpenChange = async (open: boolean) => {
    if (!open) {
      return;
    }
    console.log(labelList, "labelList");

    form.setFieldsValue({
      labelIds: (editData?.labelIds?.split(",") ?? []).map((item) => +item),
    });
  };
  return (
    <ModalForm<{
      labelIds: string[];
    }>
      onOpenChange={onOpenChange}
      title="编辑标签"
      trigger={<EditOutlined className="cursor-pointer" />}
      form={form}
      autoFocusFirstInput
      modalProps={{
        destroyOnClose: true,
        onCancel: () => console.log("run"),
      }}
      submitTimeout={2000}
      onFinish={async (values) => {
        await request.sgks.exerciseEditLabelsCreate({
          exerciseId: +editData.exerciseId,
          labelIds: values.labelIds ?? [],
        });
        message.success("编辑成功");
        onSuccess?.();
        return true;
      }}
    >
      <ProFormSelect
        name="labelIds"
        mode="multiple"
        label=""
        options={labelList}
      />
    </ModalForm>
  );
};

export default EditLabels;
